<template>
    <div class="newsinfo-tontainer">
        <h1 class="title">{{ newsinfo.title }}</h1>
        <p class="subtitle">
            <span>发表时间：{{ newsinfo.add_time | dataFormat }}</span>
            <span>点击：{{ newsinfo.click }}</span>
        </p>
        <hr>
        <div class="content" v-html="newsinfo.content"></div>
       <!-- 评论区  -->
        <comment-box :id='id'></comment-box>
    </div>
</template>

<script>
// 导入组件
import comment from '../subcomponents/comment'
export default {
    // 注册
    components:{
        'comment-box':comment
    },
    data() {
        return {
            id:this.$route.params.id,
            newsinfo:{}
        }
    },
    created() {
        this.getNewsinfo()
    },
    methods: {
        getNewsinfo(){
            this.$axios.get('api/getnew/' + this.id).then( res => {
                if(res.data.status === 0){
                    this.newsinfo = res.data.message[0]
                }else{
                    Toast('请求出错');
                }
            })
        }
    },
}
</script>

<style scoped>
.newsinfo-tontainer{
    width: 94%;
    margin: auto;
}
.newsinfo-tontainer .title{
    text-align: center;
    font-size: 18px;
    padding: 10px;
    color: red;
}
.newsinfo-tontainer .subtitle{
    display: flex;
    justify-content: space-between;
    color: #64a6e4
}
</style>